<!--
	此示例下载自 https://echarts.apache.org/examples/zh/editor.html?c=line-stack
-->
<!DOCTYPE html>
<html lang="zh-CN" style="height: 100%">

<head>
  <meta charset="utf-8">
</head>

<body style="height: 100%; margin: 0">
  <div id="container" style="height: 100% ;width: 95%"></div>

  <!-- 获取股票分时数据 -->
  <script src="{{ url_for('static',filename='js/eastmoney.js') }}"></script>
  <script src="{{ url_for('static',filename='js/jquery-2.1.1.min.js') }}"></script>
  <script src="{{ url_for('static',filename='js/update.js') }}"></script>
  <script src="{{ url_for('static',filename='js/echarts.min.js') }}"></script>

  <script type="text/javascript">
    function get_select_value(obj) {
      days = obj.options[obj.options.selectedIndex].innerHTML;
    }
  </script>

  <script type="text/javascript">
    // 股票代码转换
    function translate(stocks) {
      for (var i = 0; i < stocks.length; i++) {
        if (stocks[i][0] == '6') {
          stocks[i] = '1.' + stocks[i]
        } else {
          stocks[i] = '0.' + stocks[i]
        }
      }
      return stocks
    }
  </script>

  <script type="text/javascript">
    // 昨日连扳股票
    function get_yesterday_limit2() {
      var m_data = []
      $.ajax({
        url: '/yesterday_limit2',
        data: {},
        type: 'POST',
        async: false,
        dataType: 'json',
        success: function (data) {
          m_data = data;
        },
        error: function (msg) {
          console.log(msg);
        }
      })
      return m_data;
    };
  </script>


  <script type="text/javascript">
    // 获取分钟时间数据
    function get_m_data(_data) {
      var m = new Array(); // 分钟数组
      for (var i = 0; i < _data.length; i++) {
        m[i] = _data[i]['m']
      }
      return m
    }
    // 获取分钟涨幅数据
    function get_p_data(_data) {
      var p = new Array(); // 分钟数组
      for (var i = 0; i < _data.length; i++) {
        p[i] = _data[i]['p']
      }
      return p
    }
  </script>

  <script type="text/javascript">
    // 更新股票分时数据
    function set_data(data) {
      myChart.setOption({
        xAxis: {
          type: 'category',
          boundaryGap: false,
          data: data['m']
        },
        series: [
          {
            data: data['p']
          }
        ]
      });
    }

        // 处理连扳数据
        function process_data(data,count) {
          data = data.slice(1,2)
          var _data=[];
          for(var i=0;i<count_day-data-count;i++){
            _data.push(null);
          }
          for(var i=0;i<data;i++){
            _data.push(i+1);
          }
          return _data
        }
    // 更新多个股票分时数据
    function set_multiple_data(data,count) {
      _dates = dates.slice(-count_day,dates.length)
      
      console.log(data[1]);
      
      if (typeof (data) == "undefined") {
        return;
      }
      for (i = 0; i < data.length; i++) {
        series.push({
          name: data[i][1], data: process_data(data[i][15],count), type: 'line', showSymbol: false,
          lineStyle: {
            // type: [5, 10],
            // dashOffset: 5,
            width: 1,//线宽
          }, emphasis: {
            focus: 'series'//选择高亮显示
          },
          endLabel: {
            // offset: [-90, -10],
            show: true,
            formatter: function (params) {
              return params.seriesName + '\r\n' + params.value;
            }
          },
        })
        _legend.push(data[i][1])
      }
      console.log(_legend);
      console.log(series);
      myChart.setOption({
        // legend: { data: _legend },
        xAxis: {
          type: 'category',
          boundaryGap: false,
          data: _dates
        },
        series: series
      });
    }

    function get_stocks() {

      dates = _history_date_eastmoney()
      for (var i = 1; i < count_day; i++) {
        _data = get_limit2_data_history('fourBoardStocksYesterdayHistory', dates[dates.length - i], i, '', get_stocks_callback)
        if (_data.length > 0) {
          if (_data['data'].length > 0) {
            __data = history_all_four(_data)
            stock = stock.concat(__data['stock'])
            data_all_four = data_all_four.concat(__data['data']['data'])
          }
        }
      }
    }

    function history_all_four(data) {
      var stocks55_ = new Array()
      stocks55 = stocks55_
      for (i = 0; i < data['data'].length; i++) {
        stocks55.push(data['data'][i][0])
      }
      if (stocks55.length > 0) {
        return { 'stock': stocks55, 'data': data }
        // get_rise_data_update(stocks55, data, 'history-all-four', '历史未涨停的四板及以上个股')
      }
    }

    function get_stocks_callback(data,count,date) {
      if (data['data'].length > 0) {
        _data = history_all_four(data)
        stock = stock.concat(_data['stock'])
        data_all_four = data_all_four.concat(_data['data']['data'])
        set_multiple_data(_data['data']['data'],count)
        console.log(data_all_four);
      }
    }

    // 获取历史昨日涨停今日未涨停数据
    function get_limit2_data_history(fun, limit, count, caption, callback) {
      var m_data = []
      $.ajax({
        url: '/' + fun,
        data: { 'data': limit },
        type: 'POST',
        async: true, //异步加载
        dataType: 'json',
        success: function (data) {
          m_data = data
          callback(data,count,limit);
        },
        error: function (msg) {
          console.log(msg);
        }
      })
      return m_data;
    };

  </script>

  <script type="text/javascript">
    var series = [];
    var _legend = [];
    var stock = [], data_all_four = [], dates;
    var count_day = 250
    var days = '1'
    var dom = document.getElementById('container');
    var myChart = echarts.init(dom, null, {
      renderer: 'canvas',
      useDirtyRect: false
    });
    var app = {};
    let data = [];
    var option;

    option = {
      title: {
        // text: 'Stacked Line'
      },
      tooltip: {
        trigger: 'axis',
        order: 'valueDesc' //根据数据值, 降序排列。
      },
      grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
      },
      toolbox: {
        feature: {
          saveAsImage: {}
        }
      },
      xAxis: {
        type: 'category',
        boundaryGap: false,
      },
      yAxis: {
        type: 'value',
        gridIndex: 0
      }
    };
    console.log(option);
    if (option && typeof option === 'object') {
      myChart.setOption(option);
    }

    window.addEventListener('resize', myChart.resize);
    stocks = get_yesterday_limit2()['Stocks']
    stocks = translate(stocks)
    console.log(stocks);
    get_stocks();
    // ID_THREAD = setInterval(set_multiple_data, 1000 * 3, data_all_four); //指定3秒刷新一次
    // ID_THREAD = setInterval(get_stocks, 1000 * 3); //指定3秒刷新一次
  </script>
</body>

</html>